@extends('shop::layouts.master')
@section('title')
    编辑权益
@endsection
@section('tab')
    <style type="text/css">
        
        .layui-transfer-box{
            overflow: scroll;
        }
    </style>
        <div class="layui-fluid">
            <div class="layui-row">
                <form class="layui-form" >
                    {{csrf_field()}}
                    <fieldset class="layui-elem-field layui-field-title" style="margin-top: 30px;">
                        <legend>已添加的模块</legend>
                    </fieldset>
                    @foreach( $info as $key=>$item)
                    <div class="layui-form-item layui-col-md12">
                        <div class="layui-card">
                            <div>
                                <div class="layui-card-header">模块{{$key+1}}： {{$item['name']}} 
                                    <a title="删除" type="button" id="btn_del" href="javascript:;" data-activity_id="{{$id}}" data-id="{{$item['id']}}" style="margin-left: 50px; color: red;" >删除</a>
                                </div>
                                <div class="layui-card-body">
                                    @foreach( $item['goods_info'] as $k=>$vo)
                                        @if( $k > 0 )
                                            <br/>
                                        @endif
                                        No{{$k+1}}: {{$vo['name']}}
                                    @endforeach
                                </div>
                            </div>
                        </div>
                    </div>
                    <br />
                    <br />
                    @endforeach

                    
                    <fieldset class="layui-elem-field layui-field-title" style="margin-top: 30px;">
                        <legend>添加新模块<span style="font-size: 12px;">每行4个商品，每个模块最多三行</span></legend>
                    </fieldset>
                    <div class="layui-form-item">
                        <label for="username" class="layui-form-label">
                            <span class="x-red">*</span>模块名称</label>
                        <div class="layui-input-inline" style="width: 300px;">
                            <input type="text" name="name" lay-verify="required" autocomplete="off" class="layui-input" placeholder="请输入名称"></div>
                    </div>

                    <div class="layui-form-item">
                        <label for="username" class="layui-form-label">
                        <span class="x-red">*</span>商品选择</label>
                        <div id="test1" class="demo-transfer"></div>
                    </div>

                    <div class="layui-form-item">
                        <label for="L_repass" class="layui-form-label"></label>
                        <button class="layui-btn" lay-filter="btn_edit" lay-submit="">确认</button>
                    </div>
                </form>
            </div>
        </div>

@endsection


@section('tab_js')
    <script>
    layui.use(['form', 'jquery','transfer'], function () {
        $ = layui.jquery;
        var form = layui.form,
            transfer = layui.transfer;
            getGoodsList();

            var goods_list = [];
           function getGoodsList(){
                $.ajax({
                        url: js_url('shop-activity-goods_list'),
                        type: 'get',
                        asyuc: true,
                        data: {id:"{{$id}}"},
                        dataType: "json",
                        success: function (result) {
                            if (result.state === 0) {
                                data1 = result.data;
                                transfer.render({
                                     elem: '#test1'
                                    ,title:['可选商品','已选商品']
                                    ,data: result.data
                                    ,height: 400 //定义高度
                                    ,id:'goods_list'
                                    ,parseData: function(res){
                                        return {
                                          "value": res.id //数据值
                                          ,"title": res.name //数据标题
                                        }
                                      }
                                  })
                            } else {
                                layer.msg(result.msg, {time: 2000, icon: 5});
                            }
                        }
                    });
            }
          form.on('submit(btn_edit)', function (data) {
            var getData = transfer.getData('goods_list'); 
            if( getData.length == 0 ){
                layer.msg('请设置参与活动的商品', {time: 2000, icon: 5});
                return false;
            }
            getData.forEach(function(e,i){
                goods_list.push(e.value);
            })
            var name = $("input[name='name']").val();
            var data = {
                goods_list:goods_list,
                name:name,
                id:{{$id}}
            }

            $.ajax({
                url: js_url('shop-activity-goods_list_store'),
                type: 'post',
                data: data,
                dataType: "json",
                success: function (result) {
                    if (result.state === 0) {
                        layer.msg(result.msg, {time: 1000, icon: 6}, function () {
                            //关闭当前frame
                            xadmin.close();
                            // 可以对父窗口进行刷新
                            xadmin.father_reload();
                        });
                    } else {
                        is_submit = false;
                        layer.msg(result.msg, {time: 2000, icon: 5});
                    }
                }
            });
                return false;
          });
            $("body").on('click','#btn_del',function(){
                var _this = $(this);
                var id = _this.attr('data-id');
                var activity_id = _this.attr('data-activity_id');

                layer.confirm("确认要删除吗？请谨慎操作。", {
                    btn: ['确定','取消'] //按钮
                }, function(){
                    $.ajax({
                        url:'{{route("shop_activity_goods_del")}}',
                        type:'delete',
                        data:{id:id , activity_id:activity_id},
                        dataType : "json",
                        success:function(result){
                            if(result.state === 0){
                                getGoodsList();
                                layer.msg('删除成功', {time:1000,icon: 1});
                                _this.parent('div').parent('div').remove();
                            }else{
                                layer.msg(result.msg, {time:2000,icon: 5});
                            }
                        }
                    });
                });
            });

    })
    </script>
@endsection